<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<div class="wrap">
	<!-- 缩略图 -->
	<div class="small_pic">
		<ul>
			<c:forEach var="x" begin="1" end="24" step="1">
					<li><img src="assets/images/t/small/pic_small_${x}.jpg" alt="pic"/></li>
			</c:forEach>
		</ul>
	</div>
	<!-- 放大图 默认隐藏 点击显示-->
	<div class="big_pic">
		<ul>			
			<li><img src="assets/images/t/big/pic_big.jpg" alt="pic"/></li>
		</ul>
	</div>
</div>
<script type="text/javascript">
	//点击缩略图改变img的src地址结构。
	//每点击一次改变src地址一次
	//弹出一层显示，其余背景变暗。
	$(document).ready(function(){
		$(".small_pic li img").bind({
			click:function(){
				var img=$(".big_pic li img");
				img.removeClass();
				img.addClass("show_big");
				$(".big_pic").show();
			}
		});
	});
</script>